<template>
 
    <div class="page attendance-info">
        <div class="section location-detect com-border-bottom">
            <div class="title-box">
                <h2>当前地址<em v-if="pageDate.require_field.position==1">(必填)</em></h2>
                <a class="link" href="javascript:;" v-if="position_tune == 1" @click="resetLocation">地点微调</a>
                <a class="link" href="javascript:;" v-if="position_tune == 0" @click="reLocation">重新定位</a>
            </div>
            <p class="location" v-show="imgDate.pos">{{imgDate.pos_name}} ({{imgDate.pos}})</p>
            <p class="error" v-show="isAbnormal"><span class="bg_sprite icon"></span>当前地点不在考勤范围内</p>
        </div>
        <imageview 
            :is-requird="pageDate.require_field.photo" 
            :img-array.sync="imgArray" 
            :img-date.sync="imgDate" 
            :allow-album="allow_album"
            :example-img-url="pageDate.examples_img_url" 
            :example-img-thumb-url="pageDate.example_img_thumb_url">        
        </imageview>
        <div class="section com-border-bottom">
            <div class="title-box com-border-bottom">
                <h2>备注信息<em v-if="pageDate.require_field.remark==1">(必填)</em></h2>
            </div>
            <div class="remark-wrap">
                <textarea v-model="remarks" class="remark-input" placeholder="请输入备注信息" maxlength="50"></textarea>
            </div>            
        </div>
    </div>   
    

    <!-- 根据打卡结果展示不同的提示 -->
    <div class="weui-mask" v-show="isShowTip"></div>
    <div class="popup-tip" v-show="isShowTip">
        <div class="content com-border-bottom">
            <img class="icon icon_1" v-show="tip_img1" src="../../static/imgs/tip/i1.png" alt="">
            <img class="icon icon_1" v-show="tip_img2" src="../../static/imgs/tip/i2.png" alt="">
            <img class="icon icon_3" v-show="tip_img3" src="../../static/imgs/tip/i3.png" alt="">
            <p class="tip">{{tipMsg}}</p>
            <div class="text-wrap com-border-outside" v-show="tip_img2 || tip_img3">
                <textarea class="text" placeholder="请输入异常原因(非必填)">{{reason}}</textarea>
            </div>            
        </div>        
        <div class="btn-box">
            <a href="javascript:;" @click="confirm_tip">确定</a>            
        </div>
    </div>
    
</template>

<script>
 
    let url = ''
    let coordinate = ''
    let coordinate2 = ''//第一次定位的经纬度 地点微调时使用
    /**
     *  引入工具类库 或 Native API
     *  example : import widget from 'gapi/widget'
     */
    import widget from 'gapi/widget'
    import clientUi from 'gapi/clientUi'
    import * as util from 'js/util.js'
    import commonPage from 'clientApi/commonPage.js'
    import cache from 'gapi/cache.js'
    import location from 'gapi/location.js'
    import clientInfo from 'gapi/clientInfo'
    import KCApiApp from 'clientApi/KCApiApp.js'
    /**
     *  引入组件 以及 组件接口(Action/Getters)
     *  example : import Somecomponents from 'components/Somecomponents/Somecomponents'
     */
    import Imageview from 'components/Imageview/Imageview'

     
    /**
     *  组件实例对象
     */
    export default {
        components: {
            // Location,
            Imageview
        },
        data: function(){
            return{
                isShowTip:false,
                tipMsg:'',
                tip_img1:false,
                tip_img2:false,
                tip_img3:false,
                reason:'',
                // position: '',
                imgArray: [],
                remarks: '',
                imgDate:{
                    pos:'',
                    pos_name: ''
                },
                pageDate:{
                    team_id: 0,
                    project_id: 0,
                    examples_img_url: [],
                    example_img_thumb_url: [],
                    time_id: 0,
                    attendance_id: 0,
                    task_id: 0,
                    name: '',
                    require_field: {}
                },
                positionTip:false,
                remarkTip:false,
                photoTip:'',
                position_tune: -1,//是否允许地点微调
                tune_distance: 500,//微调范围
                type: 1,//应用类型 1：考勤；2：签到
                allow_album: false,//是否允许选择相册图片
                isAbnormal: false,//定位地点是否异常
                webViewID: '',//考勤上报时用
            }
        },
        computed:{
            photoDate(){
                let list = []
                this.imgArray.forEach((item)=>{
                    list.push(item.url)
                })
                return list
            },
            water_mark(){
                return this.allow_album ? 1 : 0
            }
        },
        vuex: {
            getters: {
                // getLoc,
                // getImageArray
            },
            actions: {

            }
        },
        methods: {
            /**
             * 初始化
             * @method init
             * @public
             * @return {Null} void
             */
            init (){
                this.type = util.getUrddataString('type') || 1
                // widget.toast(this.type)
                if(this.type == 1){
                    //考勤
                    // this.pageDate.examples_img_url = this.extra_info.examples_img_url || []  //示例图片
                    // this.pageDate.example_img_thumb_url = this.extra_info.example_img_thumb_url || []  //示例图片 缩略图
                    // data.adjust = this.extra_info.adjust || 0   //是否允许地点微调
                    // data.adjust_distance = this.extra_info.adjust_distance || 0   //地点微调距离
                    // data.project_id = ajaxDate.project_id
                    // data.team_id = ajaxDate.team_id
                    // this.pageDate.time_id = attendance.time_id
                    // this.pageDate.attendance_id = attendance.attendance_id
                    // this.pageDate.task_id = this.extra_info.task_id
                    // this.pageDate.name = this.extra_info.user_name
                    // this.pageDate.require_field = this.extra_info.require_field

                    // 获取缓存信息
                    // cache.getMemoryCache('KaoqinEditInfo', (data)=>{
                    //     console.log(data)
                    //     this.pageDate = data
                    //     // if(data.require_field.position == 1){
                    //     //     this.positionTip = true
                    //     // }else{
                    //     //     this.positionTip = false
                    //     // }
                    //     // if(data.require_field.remark == 1){
                    //     //     this.remarkTip = true
                    //     // }else{
                    //     //     this.remarkTip = false
                    //     // }
                    //     // this.photoTip = data.require_field.photo
                    //     //是否允许地点微调
                    //     this.position_tune = 1
                    //     this.tune_distance = 500
                    //     // 设置拍照水印信息
                    //     this.imgDate.name = this.pageDate.name
                    // })
                    cache.getCache('KaoqinEditInfo', (data)=>{
                        console.log(data)
                        this.pageDate.examples_img_url = data.extra_info.examples_img_url || []  //示例图片
                        this.pageDate.example_img_thumb_url = data.extra_info.example_img_thumb_url || []  //示例图片 缩略图
                        this.position_tune = data.extra_info.adjust_distance == 0 ? 0 : 1  //是否允许地点微调
                        this.tune_distance = data.extra_info.adjust_distance || 500   //地点微调距离
                        this.pageDate.project_id = data.project_id
                        this.pageDate.team_id = data.team_id
                        this.pageDate.time_id = data.attendance.time_id
                        this.pageDate.attendance_id = data.attendance.attendance_id
                        this.pageDate.task_id = data.extra_info.task_id
                        this.pageDate.name = data.extra_info.user_name
                        this.pageDate.require_field = data.extra_info.require_field
                        // 设置拍照水印信息
                        this.imgDate.name = this.pageDate.name


                        //定位
                        this.reLocation()
                    })
                    cache.getMemoryCache('webViewID', (data)=>{
                        // alert(JSON.stringify(data))
                        this.webViewID = data.webViewID
                    })
                }else{
                    //签到
                    this.pageDate.team_id = util.getUrddataString('team_id')
                    this.pageDate.project_id = util.getUrddataString('project_id')
                    this.pageDate.name = util.getUrddataString('user_name')
                    // 设置拍照水印信息
                    this.imgDate.name = this.pageDate.name
                    //获取签到设置信息
                    this.getSetSignInfo()

                    //定位
                    this.reLocation()
                }
                
                
            },
            reLocation (){
                commonPage.loadPageStatus('loading')
                location.requestPOI((data)=>{
                    console.log(data)
                    commonPage.loadPageStatus('loadSuccess')
                    if(data&&data.lon != undefined){
                        coordinate = data.lon+','+data.lat
                        coordinate2 = coordinate2 ? coordinate2 : data.lon+','+data.lat
                        this.imgDate.pos = data.district+data.streetName
                        this.imgDate.pos_name = data.name
                        console.log(this.imgDate.pos_name)
                        console.log(coordinate)

                        if(this.type == 1){
                            //检测定位点是否在微调范围内
                            this.checkLocation()
                        }
                        
                    }else{
                        KCApiApp.showLocationAuthAlertDialog()
                        // widget.toast('定位失败')
                    }
                })
            },
            submit (){
                if(this.pageDate.require_field.photo==1){
                    // 照片必选验证
                    if(!this.imgArray.length){
                        widget.toast('请提交图片')
                        return
                    }
                }
                if(this.pageDate.require_field.position==1){
                    // 定位验证
                    if(this.imgDate.pos === ''){
                        widget.toast('请提交定位信息')
                        return 
                    }
                }
                if(this.pageDate.require_field.remark==1){
                    // 备注验证
                    if(this.remarks === ''){
                        widget.toast('请填写备注')
                        return
                    }
                }

                // 发送网络请求
                commonPage.loadPageStatus('loading')
                let ajaxDate = this.getAjaxDate()
                console.log(ajaxDate)
                util.ajax({
                    url: url,
                    type:'POST',
                    data: ajaxDate,
                    success: (res) => {
                        console.log(res)
                        commonPage.loadPageStatus('loadSuccess')
                         if(res&&res.errno==0){
                            if(this.type == 1){
                                let status = res.data.status
                                this.isShowTip = true
                                if(status == '正常'){
                                    this.tipMsg = '打卡成功'
                                    this.tip_img1 = true
                                }else if(status == '地点异常'){
                                    this.tipMsg = '地点异常'
                                    this.tip_img2 = true
                                }else{
                                    this.tipMsg = status
                                    this.tip_img3 = true
                                }
                            }else{
                                commonPage.goBack(1)
                            }
                            
                        }else if(res.errmsg){
                             widget.toast(res.errmsg)
                        }else{
                            widget.toast('数据获取失败')
                        }
                    },
                    error: (xhr, error) => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    },
                    noNetwork: () => {
                        // 无网络的回调
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            },
            confirm_tip (){
                console.log(this.tip_img2)
                console.log(this.tip_img3)
                let _data = {
                            team_id:this.pageDate.team_id,
                            project_id:this.pageDate.project_id,
                            attendance_id:this.pageDate.attendance_id,
                            reason:this.reason
                        }
                console.log(_data)
                if(this.tip_img2 || this.tip_img3){
                    util.ajax({
                        url: '/attendance/abnormal_reason/add',
                        type:'GET',
                        data: _data,
                        success: (res) => {
                            console.log(res)
                            if(res&&res.errno==0){
                                // commonPage.goBack(1,{'key':'yy_kqeditinfo'}, this.webViewID)
                            }else if(res.errmsg){
                                 widget.toast(res.errmsg)
                            }else{
                                widget.toast('数据获取失败')
                            }
                        },
                        error: (xhr, error) => {
                            widget.toast('服务器异常')
                        },
                        noNetwork: () => {
                            // 无网络的回调
                            widget.toast('网络连接失败，请检查网络')
                        }
                    })
                }else{
                    console.log(999)
                    // commonPage.goBack(1,{'key':'yy_kqeditinfo'}, this.webViewID)
                }
            },
            getAjaxDate(){
                let date = {}
                if(this.type == 1){
                    date = {
                        team_id: this.pageDate.team_id,
                        project_id: this.pageDate.project_id,
                        task_id: this.pageDate.task_id,
                        time_id:this.pageDate.time_id,
                        photo: this.photoDate,
                        position: this.imgDate.pos,
                        position_name: this.imgDate.pos_name,
                        coordinate: coordinate,
                        remark: this.remarks
                    }
                    if(this.pageDate.attendance_id){
                        date.attendance_id = this.pageDate.attendance_id
                        url="/attendance/attendance/update"
                    }else{
                        url="/attendance/attendance/add"
                    }
                }else if(this.type == 2){
                    date = {
                        team_id: this.pageDate.team_id,
                        project_id: this.pageDate.project_id,
                        img: JSON.stringify(this.photoDate),
                        address: this.imgDate.pos,
                        Lng_Lat: coordinate,
                        position_name: this.imgDate.pos_name,
                        desc: this.remarks,
                        water_mark: this.water_mark
                    }
                    url = '/sign/user/submit'
                }
                
                return date
            },
            resetLocation(){
                clientInfo.getNetworkType((data) => {
                    // alert(JSON.stringify(data))    // 网络信息
                    if(data.network == 'invalid'){
                        widget.toast("网络连接失败，请检查网络")
                        return
                    }
                    let encodeStr = encodeURIComponent(`tune_distance=${this.tune_distance}&address_lat=${coordinate2.split(',')[1]}&address_lng=${coordinate2.split(',')[0]}`)
                    window.location.href = `dmsaas://ResetLocation?urdData=${encodeStr}`
                })
            },
            getSetSignInfo(){
                util.ajax({
                    url: '/sign/project/setting',
                    type:'GET',
                    data: {
                        team_id: this.pageDate.team_id,
                        project_id: this.pageDate.project_id
                    },
                    success: (res) => {
                        // alert(JSON.stringify(res))
                        commonPage.loadPageStatus('loadSuccess')
                        if(res&&res.errno == 0){
                            this.pageDate.require_field = res.data.setting_data.require_field
                            this.allow_album = res.data.setting_data.allow_album == 1 ? true : false
                            this.position_tune = res.data.setting_data.position_tune
                            this.tune_distance = res.data.setting_data.tune_distance
                        }else{
                            widget.toast(res.errmsg)
                        }
                    },
                    error: (xhr, error) => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    },
                    noNetwork: () => {
                        // 无网络的回调
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            },
            //检测定位点是否在微调范围内
            checkLocation(){
                // alert(this.pageDate.team_id)
                // alert(this.pageDate.project_id)
                // alert(coordinate)
                // alert(this.pageDate.task_id)
                // alert(JSON.stringify(this.pageDate))
                if(!coordinate){
                    widget.toast('定位失败,请稍后重试')
                    return
                }
                commonPage.loadPageStatus('loading')
                util.ajax({
                    url: '/attendance/position/check',
                    type:'GET',
                    data: {
                        team_id: this.pageDate.team_id,
                        project_id: this.pageDate.project_id,
                        coordinate: coordinate,
                        task_id: this.pageDate.task_id
                    },
                    success: (res) => {
                        console.log(res)
                        // alert(JSON.stringify(res))
                        commonPage.loadPageStatus('loadSuccess')
                        if(res&&res.errno==0){
                            if(res.data.valid == 1){
                                this.isAbnormal = false
                            }else{
                                this.isAbnormal = true
                            }
                        }else{
                             widget.toast(res.errmsg)
                        }
                    },
                    error: (xhr, error) => {
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('服务器异常')
                    },
                    noNetwork: () => {
                        // 无网络的回调
                        commonPage.loadPageStatus('loadSuccess')
                        widget.toast('网络连接失败，请检查网络')
                    }
                })
            }
        },
        created(){
            this.init()
            /**
             * 设置提交按钮
             * @type {String}
             */
            commonPage.updateTitleBar({
                backAction: '',
                leftDisplay: false,
                leftText: '',
                leftAction: '',
                rightDisplay: true,
                rightText: '提交',
                rightAction: 'doSubmit'
            })

            window.doSubmit = this.submit
            window.loadData = (data) => {
                console.log(data)
                if(data&&data !== undefined){
                    if(data.key === "position"){
                        coordinate = data.value.coordinate
                        this.imgDate.pos = data.value.address
                        this.imgDate.pos_name = data.value.name

                        if(this.type == 1){
                            //检测定位地点是否在微调范围内
                            this.checkLocation()
                        }
                        
                    }
                }
            }
        }
        
    }

    
</script>

<!-- CSS 样式 -->
<style src="../../node_modules/weui/dist/style/weui.css"></style>
<style src="../../static/css/common.css"></style>
<style src="../../static/css/attendance.css"></style>



